<template>
<div class="layerRtb layerRtb-threecolumn layerRtb-right">
    <three-title :title="{name:'历史'}" :close="false">
        <span tag="i" class="rig_close fr" @click="$parent.$parent.clickFourShow()"></span>
    </three-title>
    <div class="layerRtb-scroll thinScroll" v-scrollHeight = "137">
        <div class="analyItem" v-if='historys.length===0'>
            <p class="analyItemTit tx-center">绩效处理</p>
            <div class="analyItemCon">
                <span>暂无绩效处理记录</span>
            </div>
        </div>
        <div class='analyItem' v-for='(item,index) in historys' :key="index">
            <p class="analyItemTit tx-center">绩效处理</p>
            <div class="analyItemCon">
                <p class="col-md-4">
                    <span class="cLightGray pr8">绩效人</span>
                    <span class=" ">{{item.performancor}}</span>
                </p>
                <p class="col-md-4">
                    <span class="cLightGray pr8">月份</span>
                    <span class=" ">{{item.recordDate + '月'}}</span>
                </p>
                <p class="col-md-4">
                    <span class="cLightGray pr8">操作人</span>
                    <span class=" ">{{item.acceptor}}</span>
                </p>
                <p class="col-md-4">
                    <span class="cLightGray pr8">操作时间</span>
                    <span class=" ">{{item.modifyDate}}</span>
                </p>
                <p class="col-md-4">
                    <span class="cLightGray pr8">目标值</span>
                    <span class=" ">{{item.target}}{{item.unit}}</span>
                </p>
                <p class="col-md-4">
                    <span class="cLightGray pr8">实际值</span>
                    <span class=" ">{{item.completion}}{{item.unit}}</span>
                </p>
                <p class="col-md-4">
                    <span class="cLightGray pr8">系统结果</span>
                    <span v-text='item.result'></span>
                </p>
                <p class="col-md-4">
                    <span class="cLightGray pr8">实际奖罚</span>
                    <strong class="fz14" :class="{'cGreen':item.result>=0,'cRed':item.result>=0}" v-text='item.result'></strong>
                </p>
                <p class="col-md-12">
                    <span class="cLightGray pr8">备注</span>
                    <span v-text='item.remarks'></span>
                </p>
            </div>
        </div>
    </div>
    <div class="layerRtb-footer">
        <div class="analyItem">
            <p class="analyItemTit tx-center">综合</p>
            <div class="analyItemCon">

            </div>
        </div>
    </div>
</div>
</template>
<script>
import { mapGetters } from 'vuex'
import { fetchPerformanceRecords } from '../../Resources/Api'
export default {
    data () {
        return {
            historys: []
        }
    },
    created () {
        // 获取历史绩效
        this.getHistoryPerformance()
    },
    computed: {
        ...mapGetters(['leftInfo'])
    },
    watch: {

    },
    methods: {
        getHistoryPerformance () {
            this.historys = []
            fetchPerformanceRecords({
                region: this.leftInfo.u_diqu,
                stage: 1
            }).then(results => {
                if (results.data.StatusCode === 0) {
                    this.historys = results.data.Body
                }
            }).catch(error => {
                console.log(error)
            })
        }
    }
}
</script>
